<div class="print">
  <div class="title">下料单</div>
  <div class="content">
    <div class="order-num">单号：{{data.info.prodNum}}</div>
    <div class="base-info">
      <div class="info-item">
        <span>客户名称：</span>{{data.info.userName}}
      </div>
      <div class="info-item">
        <span>打印日期：</span>{{now | date: 'yyyy-MM-dd'}}
      </div>
      <div class="info-item">
        <span>产品：</span>
        <div class="selector">
          <mat-select [(ngModel)]="currentPro" 
            placeholder="请选择一种产品"
            >
            <mat-option *ngFor="let item of data.info.currentPro.params" [value]="item">
              {{item.desc}}
            </mat-option>
          </mat-select>
        </div>
      </div>
      <div class="info-item">
        <span>交货日期：</span>{{data.info.time | date: 'yyyy-MM-dd'}}
      </div>
      <div class="info-item">
        <span>备注：</span>{{data.info.remark}}
      </div>
    </div>
    <div class="product-info" *ngIf="currentPro">
      <table>
        <tr>
          <th>名称</th>
          <th>参数</th>
          <th>尺寸</th>
          <th>数量</th>
        </tr>
        <ng-container *ngFor="let subItem of currentPro.subParams">
          <tr>  
            <td rowspan="2">{{subItem.desc}}</td>
            <td>{{subItem.alias.h}}</td>
            <td>{{subItem.h(data.info.height) | number:'0.0-3'}}</td>
            <td><input type="text"></td>
          </tr>
          <tr>
            <td>{{subItem.alias.w}}</td>
            <td>{{subItem.w(data.info.width) | number:'0.0-3'}}</td>
            <td><input type="text"></td>
          </tr>
        </ng-container>
      </table>
    </div>
    <div class="barcode-wrapper">
      <canvas id="barcode"></canvas>
    </div>
  </div>
</div>
